.background-color-title {
  background-color: #e7e4e4;
}

.badge-setting-title {
  background-color: #e7e4e4;
  padding-left: 1rem;
  line-height: 3rem;
}

.badge-setting {
  border: solid 1px #d3d3d3;
  border-radius: 5px;
}

.badge-form-body {
  margin: 0 .5rem .5rem;
  border: solid 1px #d3d3d3;
  border-radius: 5px;
  padding: .5rem 1rem;
}

.lh-2r {
  line-height: 2rem;
}

.badge-form-body-field {
  border: solid 1px #d3d3d3;
  border-radius: 5px;
  padding-left: 1rem;
}

.padding-left-1rem {
  padding-left: 1rem;
}

.pr-2rem {
  padding-right: 2rem !important;
}

.margin-left-revert-1rem {
  margin-left: -1rem;
}

.spectrum-color-picker-replacer {
  width: 10%;
  border-radius: 2px;
}

.spectrum-color-picker-replacer .sp-preview {
  width: 100%;
  height: 1rem;
}

.spectrum-color-picker-replacer .sp-dd {
  display: none;
}

.min-width-0 {
  min-width: 0 !important;
}

.font-color .spectrum-color-picker-replacer {
  width: 100%;
  border-radius: 5px;
}

.font-color .spectrum-color-picker-replacer .sp-preview {
  width: 100%;
  height: 2rem;
}

label.warning {
  color: #db2828 !important;
}

.badge-orientation,
.badge-size {
  width: 18rem;

  .drop-down-badge {
    min-width: 18rem !important;
  }
}

.row-field {
  display: flex;
  width: 100%;

  h3 {
    width: 85%;
  }

  .btn-row {
    width: 15%;

    .remove-icon {
      margin-right: 5px !important;
    }
  }
}

.badge-field-form {
  margin-top: 32px;
}

.blog-icon-preview {
  position: relative;

  label {
    position: absolute;
    top: 5px;
  }
}

.badge-preview {
  .badge-preview-title {
    margin-bottom: unset !important;
  }

  .label-checkbox-sample {
    margin: unset !important;
  }

  .preview {
    padding: 50px !important;
    border-top: 1px solid rgb(211, 211, 211);
    margin-top: unset;
  }
}
